<template>
  <div class="app-container">
    <el-tabs type="border-card" :value="activeTab" @tab-click="changeTab">
      <el-tab-pane v-if="roleCheck('list')" name="one" label="活动管理">
        <offer-list/>
      </el-tab-pane>
      <el-tab-pane v-if="roleCheck('create')" name="create" label="新建活动">
        <offer-edit v-show="activeTab === 'create'"/>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>
<script>
import OfferEdit from './offerEdit';
import OfferList from './offerList';

import { tabs } from '@/build';

export default {
  name: 'offer-configuration',

  components: {
    OfferEdit,
    OfferList,
  },

  mixins: [tabs],

  data() {
    return {
      activeTab: 'one',
    };
  },
  mounted() {
    this.$store.dispatch(types.SAVE_OPERATION_LOG, { content: _.getContent(this.$route, '活动管理', true) });
  },
  methods: {
    changeTab(tabs) {
      this.activeTab = tabs.name;
      this.$store.dispatch(types.SAVE_OPERATION_LOG, { content: _.getContent(this.$route, tabs.label, true) });
    },
  },
};
</script>

<style scoped>

</style>
